<template>
    <pageBox>
        <view class="index-page">
            <view :class="{nav : top === 0}">
                <view class="status_bar">
                    <!-- 这里是状态栏 -->
                </view>
                <view class="bgTop  ">
                    <view class="uni-list leftNav  ">
                        <view class="uni-list-cell">
                            <view class="uni-list-cell-db">
                                <view class="uni-list-cell-db" v-show="role_grade == 1">
                                    <!-- <picker mode="multiSelector" @change="bindMultiPickerChange" @columnchange="bindMultiPickerColumnChange" :value="multiIndex" :range="multiArray" style="color:#ffffff;background:#0c69a4; margin-left: 160px;width: 220px;height: 28px;font-size: 25rpx;line-height: 50rpx;position:relative; top:33rpx">
                                        　　<view class="picker">
                                            <text v-show="selectData == 0">请选择设备</text>
                                            <text v-show="selectData2 == 1">{{multiArray[0][multiIndex[0]]}} > {{multiArray[1][multiIndex[1]]}}</text>
                                        </view>
                                    </picker> -->

                                    <picker mode="selector" @change="bindMultiPickerChange1" :value="multiIndex" :range="multiArray" style="color:#ffffff;background:#0c69a4; margin-left: 160px;width: 220px;height: 28px;font-size: 25rpx;line-height: 50rpx;position:relative; top:33rpx" :range-key="name">
                                        　　<view class="picker">
                                            <text v-show="selectData == 0">请选择公司</text>
                                            <text v-show="selectData == 1">{{names}}</text>
                                        </view>
                                    </picker>

                                </view>
                            </view>
                        </view>
                    </view>
                </view>
            </view>

            <view class="tab-nav-border mtStatusbar">

                <uni-segmented-control :current="current" :values="tabArr" @clickItem="onClickItem" style-type="text" active-color="#0B72B4">
                </uni-segmented-control>
                <uni-segmented-control :current="current" :values="tabArr" @clickItem="onClickItem" style-type="text" active-color="#0B72B4" v-if="tittleTop === true" class="tittleTop">
                </uni-segmented-control>
                <view class="bor"></view>
            </view>
            <view class="content">
                <view v-show="current === 0">
                    <view class="list">
                        <view class="img-des-item flex-box ic" v-for="(item, index) in list" :key="index" @click="toDetails(item.id)">

                            <view class="img-box">
                                <image :src="item.img_pic" mode=""></image>
                            </view>
                            <view class="des-box">
                                <view>
                                    <text class="tt">{{ item.tt }}</text>
                                    <view class="tag" v-if="item.status == '在线'">
                                        <icon type="success" size="12" color="#fff"></icon>
                                        <text>{{ item.status}}</text>
                                    </view>
                                    <view class="tag off" v-else-if="item.status == '离线'">
                                        <icon type="clear" size="12" color="#fff"></icon>
                                        <text>{{ item.status}}</text>
                                    </view>
                                    <view class="tag warn" v-else>
                                        <icon type="warn" size="12" color="#fff"></icon>
                                        <text>{{ item.status}}</text>
                                    </view>
                                </view>
                                <view class="view-txt">
                                    <text>设备编号：</text>
                                    <text class="col-29">{{ item.name }}</text>
                                </view>
                                <view class="view-txt">
                                    <text>设备地址：</text>
                                    <text class="col-29">{{ item.equipment_address}}</text>
                                </view>
                            </view>

                        </view>
                    </view>
                </view>
                <view v-show="current === 1" v-for="(item, index) in list" :key="index">
                    <view v-show="item.status === '在线'">
                        <view class="list">
                            <view class="img-des-item flex-box ic" @click="toDetails(item.id)">
                                <view class="img-box">
                                    <image :src="item.img_pic" mode=""></image>
                                </view>
                                <view class="des-box">
                                    <view>
                                        <text class="tt">{{ item.tt }}</text>
                                        <view class="tag" v-if="item.status == '在线'">
                                            <icon type="success" size="12" color="#fff"></icon>
                                            <text>{{ item.status}}</text>
                                        </view>
                                        <view class="tag off" v-else-if="item.status == '离线'">
                                            <icon type="clear" size="12" color="#fff"></icon>
                                            <text>{{ item.status}}</text>
                                        </view>
                                        <view class="tag warn" v-else>
                                            <icon type="warn" size="12" color="#fff"></icon>
                                            <text>{{ item.status}}</text>
                                        </view>
                                    </view>
                                    <view class="view-txt">
                                        <text>设备编号：</text>
                                        <text class="col-29">{{ item.name }}</text>
                                    </view>
                                    <view class="view-txt">
                                        <text>设备地址：</text>
                                        <text class="col-29">{{ item.equipment_address }}</text>
                                    </view>
                                </view>
                            </view>
                        </view>
                    </view>
                </view>

                <view v-show="current === 2" v-for="(item, index) in list" :key="index">
                    <view v-show="item.status === '离线'">
                        <view class="list">
                            <view class="img-des-item flex-box ic" @click="toDetails(item.id)">
                                <view class="img-box">
                                    <image :src="item.img_pic" mode=""></image>
                                </view>
                                <view class="des-box">
                                    <view>
                                        <text class="tt">{{ item.tt }}</text>
                                        <view class="tag" v-if="item.status == '在线'">
                                            <icon type="success" size="12" color="#fff"></icon>
                                            <text>{{ item.status}}</text>
                                        </view>
                                        <view class="tag off" v-else-if="item.status == '离线'">
                                            <icon type="clear" size="12" color="#fff"></icon>
                                            <text>{{ item.status}}</text>
                                        </view>
                                        <view class="tag warn" v-else>
                                            <icon type="warn" size="12" color="#fff"></icon>
                                            <text>{{ item.status}}</text>
                                        </view>
                                    </view>
                                    <view class="view-txt">
                                        <text>设备编号：</text>
                                        <text class="col-29">{{ item.name }}</text>
                                    </view>
                                    <view class="view-txt">
                                        <text>设备地址：</text>
                                        <text class="col-29">{{ item.equipment_address }}</text>
                                    </view>
                                </view>
                            </view>
                        </view>
                    </view>
                </view>

                <view v-show="current === 3" v-for="(item,index) in list" :key="index">
                    <view v-show="item.alarm_status_name === '报警'">
                        <view class="list">
                            <view class="img-des-item flex-box ic" @click="toDetails(item.id)">
                                <view class="img-box">
                                    <image :src="item.img_pic" mode=""></image>
                                </view>
                                <view class="des-box">
                                    <view>
                                        <text class="tt">{{ item.tt }}</text>
                                        <!-- <view class="tag" v-if="item.status == '在线'">
                                        <icon type="success" size="12" color="#fff"></icon>
                                        <text>{{ item.status}}</text>
                                    </view> -->
                                        <!-- <view class="tag off" v-if="item.status == '离线'">
                                            <icon type="clear" size="12" color="#fff"></icon>
                                            <text>{{ item.status}}</text>
                                        </view> -->
                                        <view class="tag warn" v-if="item.alarm_status_name == '报警'">
                                            <icon type="warn" size="12" color="#fff"></icon>
                                            <text>{{ item.alarm_status_name}}</text>
                                        </view>
                                    </view>
                                    <view class="view-txt">
                                        <text>设备编号：</text>
                                        <text class="col-29">{{ item.name }}</text>
                                    </view>
                                    <view class="view-txt">
                                        <text>设备地址：</text>
                                        <text class="col-29">{{ item.equipment_address }}</text>
                                    </view>
                                </view>
                            </view>
                        </view>
                    </view>
                </view>
            </view>
        </view>
    </pageBox>
</template>

<script>
import {
    uniSegmentedControl,
    uniLoadMore
} from "@dcloudio/uni-ui";
import {
    request
} from "../../comon/js/request.js";
import QSpicker from "../../components/QuShe-picker/QuShe-picker.vue";
import pickerCustom2 from "../../components/QS-inputs-split/elements/QS-picker-custom2/index.vue";
import log from '../../components/QS-inputs-split/config/js/log.js';
// import pickerCustom2 from "../../components/QS-picker-custom2/QS-picker-custom2.vue"
export default {
    data() {
        return {
            names: "",
            ids: "",
            num1: 0,
            num2: 0,
            top: true,
            tittleTop: false,
            role_grade: 0,
            formName: "picker_custom",
            steps: {
                step_1_value: "name" //第一级显示的属性名
            },

            steps1: {
                step_1_value: "name" //第一级显示的属性名
            },

            steps2: {
                step_1_value: "name" //第一级显示的属性名
            },

            steps3: {
                step_1_value: "name",
                step_2_value: "name"
            },
            customId3: {
                id: "001"
            },

            selectData: 0,
            selectData2: 1,
            page: 1,
            onLine: 0,
            offLine: 0,
            callLin: 0,
            // user:9,
            multiArray: [],
            multiIndex: [0],
            index: '',
            // multiIndex: [0, 0],
            sonId: "",
            allData: [],
            // multiIndex: [0, 0],
            array: [],
            oneId: 0,
            twoId: 0,
            current: 0,
            title: "Hello",
            customSet_3: {
                itemArray: [{
                    name: "", //value_1变量名需与下方steps.steps_1_value相同
                    id: 1,
                    /*
                    可添加多项自定义想要的数据
                    */
                    parent: [{
                        //item_2变量名需与下方steps.steps_2_item相同
                        name: "", //value_2变量名需与下方steps.steps_2_value相同
                        id: 2
                    }]
                }],
                steps: {
                    step_1_value: "name",
                    step_2_item: "parent",
                    step_2_value: "name"
                },
                linkageNum: 2, //3 表示为3级联动
                linkage: true //true 表示开启联动
            },
            list: [],
            tabArr: ["0\n全部", "0\n在线", "0\n离线", "0\n报警"],
        };
    },
    onLoad() {
        uni.getStorage({
            key: 'isLogin',
            success: (res) => {
                if (res.data) {
                    uni.getStorage({
                        key: 'wx_openid',
                        success: (res) => {
                            if (res.data === "" || res.data === null) {
                                uni.showModal({
                                    title: '该账号尚未绑定微信,是否绑定当前微信?',
                                    success: (res) => {
                                        if (res.confirm) {
                                            this.getOpenid();
                                        } else if (res.cancel) {
                                            uni.setStorageSync("isLogin", false);
                                            console.log('用户点击取消');
                                            this.getOpenids()
                                        }
                                    }
                                });
                            } else {

                            }
                        }
                    });
                }
            }
        })
        this.getMsg();
    },

    onShow() {
        this.getPeopleMsg();
        this.getOnLine();
        this.alarmRecord()
        // this.getGroup();
        // this.getSite();
        this.getSon();
        this.setrole_grade()
        this.getNotRead()
        // this.showTibs();
    },
    onPageScroll(e) {
        // console.log(e.scrollTop)
        if (e.scrollTop >= 0) {
            if (!this.top) {
                this.top = true
            }
        } else {
            if (this.top) {
                this.top = false
            }
        }
        if (e.scrollTop >= 100) {
            this.tittleTop = true
        } else {
            this.tittleTop = false

        }
    },
    onReachBottom() {
        if (this.page <= this.pageMax)
            this.getMore();
    },
    onPullDownRefresh() {
        this.getMsg();
        setTimeout(function () {
            uni.stopPullDownRefresh();
        }, 3000);
    },
    onReady() {
        // this.setPickerData();
    },
    methods: {
        //获取权限
        getPeopleMsg() {
            request({
                url: "v1/user/permission"
            }).then(res => {
                if (res.data.errorCode === 0) {
                    let arr = res.data.result.permission
                    let controlCenter = [] //控制中心
                    let stockPermission = [] //库存权限
                    let stockPsermissions = [] //待见统计 / 已检记录
                    let paymentManagement = [] //支付权限
                    let dataCenter = [] //数据中心 (包括历史数据)
                    let camera_videoList = [] //监控视频
                    let equipmentManagement = [] //设备管理
                    arr.map(item => {
                        if (item.name == "stockControl") {
                            if (item.children.length && typeof item.children != "undefined") {
                                item.children.map(stockItem => {
                                    stockPermission.push(stockItem.name)
                                })
                                item.children.map(stockItem => {
                                    stockPsermissions.push(stockItem.show_name)
                                })
                            }

                            uni.setStorageSync("stockPermission", stockPermission) // 缓存起来的数组
                            uni.setStorageSync("stockPermission2", stockPsermissions) // 缓存起来的数组
                        }
                        if (item.name == "paymentManagement") {
                            if (item.children.length && typeof item.children != "undefined") {
                                item.children.map(item => {
                                    paymentManagement.push(item.name)
                                })
                                uni.setStorageSync("paymentManagement", paymentManagement) // 缓存起来的数组
                            }
                        }
                        if (item.name == "dataCenter") {
                            if (item.children.length && typeof item.children != "undefined") {
                                item.children.map(item => {
                                    dataCenter.push(item.name)
                                })
                                uni.setStorageSync("dataCenter", dataCenter) // 缓存起来的数组
                            }
                        }
                        if (item.name === "videoCenter") {
                            if (item.children.length && typeof item.children != "undefined") {
                                item.children.map(item => {
                                    camera_videoList.push(item.name)
                                })
                                uni.setStorageSync("camera_videoList", camera_videoList) // 缓存起来的数组
                            }
                        }
                          if (item.name === "equipmentManagement") {
                            if (item.children.length && typeof item.children != "undefined") {
                                item.children.map(item => {
                                    equipmentManagement.push(item.name)
                                })
                                uni.setStorageSync("equipmentManagement", equipmentManagement) // 缓存起来的数组
                            }
                        }
                          if (item.name === "controlCenter") {
                            if (item.children.length && typeof item.children != "undefined") {
                                item.children.map(item => {
                                    controlCenter.push(item.name)
                                })
                                uni.setStorageSync("controlCenter", controlCenter) // 缓存起来的数组
                            }
                        }
                    })
                }
            })
        },
        setrole_grade() {
            let role_grade = uni.getStorageSync("role_grade")
            // console.log(role_grade)
            this.role_grade = role_grade
        },
        //获取opendid(用来不绑定微信也可以进行支付的)
        getOpenids() {
            let token = uni.getStorageSync("token")
            uni.login({
                provider: "weixin",
                success: function (loginRes) {
                    let code = loginRes.code;
                    // console.log(code)
                    uni.request({
                        url: "https://yl.solid-cn.com/wechat/v1/wechat/getOpenId",
                        data: {
                            code
                        },
                        header: {
                            Accept: "application/json",
                            xcx: 1,
                            Authorization: `Bearer ${token}`
                        },
                    }).then(res => {
                        console.log(res[1].data.result.openid)
                        uni.setStorageSync("wx_openid", res[1].data.result.openid)
                    })
                }
            })
        },

        //绑定微信
        getOpenid() {
            let token = uni.getStorageSync("token")
            const _this = this
            uni.login({
                provider: "weixin",
                success: function (loginRes) {
                    let code = loginRes.code;
                    console.log('code', code);
                    uni.request({
                        url: "https://yl.solid-cn.com/wechat/v1/wechat/getOpenId",
                        data: {
                            code
                        },
                        header: {
                            Accept: "application/json",
                            xcx: 1,
                            Authorization: `Bearer ${token}`
                        },
                    }).then(resData => {
                        let res = resData[1]
                        const wxOpenId = res.data.result.openid
                        console.log('wxOpenId', wxOpenId);
                        uni.getUserInfo({
                            provider: 'weixin',
                            success: function (infoRes) {
                                let nickName = infoRes.userInfo.nickName; //昵称
                                let avatarUrl = infoRes.userInfo.avatarUrl; //头像
                                uni.setStorageSync("wx_openid", wxOpenId);
                                uni.setStorageSync("isLogin", false);
                                uni.setStorageSync("session_key", res.data.result.session_key);
                                _this.bindWeChat(wxOpenId, nickName, avatarUrl)
                            }
                        });

                        console.log(res, "获取openid");

                    });
                }
            });
        },
        // 绑定微信
        bindWeChat(openid, nickName, avatarUrl) {
            let token = uni.getStorageSync("token")
            uni.request({
                url: "https://yl.solid-cn.com/wechat/v1/wechat/wxBindUser",
                method: "POST",
                data: {
                    openid,
                    nickName,
                    avatarUrl,
                },
                header: {
                    Accept: "application/json",
                    xcx: 1,
                    Authorization: `Bearer ${token}`
                },
            }).then(res => {
                console.log(res)
                const data = res[1]
                if (data.data.errorCode == 0) {
                    uni.showModal({
                        title: data.data.result,
                        showCancel: false,
                    });
                } else {
                    uni.showModal({
                        title: data.data.message,
                        showCancel: false,
                    });
                }

            })
        },
        //微信内容推送
        wxPush(id) {
            // let than = this
            let openid1 = uni.getStorageSync("wx_openid");
            // console.log(openid1, "*******************------------", id);
            request({
                url: "v1/wxForm/formId",
                method: "POST",
                data: {
                    openid: openid1,
                    formId: id
                }
            }).then(res => {
                console.log(res, "..............微信推送..............");
            });
        },
        //获取表单id
        formSubmit: function (e) {
            // console.log('form发生了submit事件，携带数据为：' + JSON.stringify(formdata))
            let formId1 = e.detail.formId;
            console.log(e.detail.formId, ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;");
            // uni.showModal({
            //     content: "表单数据内容：" + JSON.stringify(formId1),
            //     showCancel: false
            // });
            this.wxPush(JSON.stringify(formId1));
        },
        //上拉加载更多
        getMore() {
            // console.log("刷新了吗");
            // let addPage = this.page++;
            // this.getMsg();
            this.page++
            request({
                url: "v1/equipment/list",
                method: "GET",
                data: {
                    page: this.page
                }
            }).then(res => {
                // this.list = res.data.result.list.data;
                this.list = this.list.concat(res.data.result.list.data)
                console.log(res, "加载第二页");
                this.resOnline(this.list);
                // let tabArr = [
                //     `${res.data.result.list.total}\n全部`,
                //     `${this.onLine}\n在线`,
                //     `${this.offLine}\n离线`,
                //     `${this.callLin}\n报警`
                // ];
                // this.tabArr = tabArr;
                // this.pageMax = res.data.result.list.last_page
            });

        },
        changeShow(name) {
            this.$refs[name].show();
            this.$forceUpdate();
            // this.wxPush()
            // this.$forceUpdate();
        },
        showQSPicker(res) {
            console.log(
                `pickerId为${res.pickerId},类型为${res.type}的QS-picker显示了`
            );
        },
        hideQSPicker(res) {
            console.log(
                `pickerId为${res.pickerId},类型为${res.type}的QS-picker隐藏了了`
            );
        },
        confirm(res) {
            // console.log('获取了用户选择----->' + JSON.stringify(res));
            console.log("获取了用户选择----->", res);
            this.selectData = res.data.steps1.name;
            this.selectData2 = res.data.steps2.name;
            request({
                url: `v1/equipment/list?group_id=${res.data.steps2.id}`,
                method: "GET"
            }).then(res => {
                console.log(res, "99999999999999999");
                this.list = res.data.result.list.data;
                this.resOnline(res.data.result.list.data);
                let tabArr = [
                    `${this.list.length}\n全部`,
                    `${this.onLine}\n在线`,
                    `${this.offLine}\n离线`,
                    `${this.callLin}\n报警`
                ];
                this.tabArr = tabArr;
            });
            // if (res.data.steps3 != undefined) {
            //     res.data.steps3.id
            // } else if (res.data.steps2 != undefined) {
            //     res.data.steps2.id
            // } else if (res.data.steps1 != undefined) {
            //     res.data.steps1.id
            // }
        },
        getSon() {
            // let than = this;
            request({
                url: "v1/company/all",
                method: "GET"
            }).then(res => {
                console.log(res.data.result, "获取左上角分组")
                this.array = res.data.result
                this.oneId = res.data.result[0].id
                // this.twoId = res.data.result[0].parent[0].id
                this.initData()
            });
        },

        //获取设备控制

        // 获取在线状态,
        resOnline(arr) {
            this.onLine = 0;
            this.offLine = 0;
            this.callLin = 0;
            arr.forEach(item => {
                if (item.status === "在线") {
                    this.onLine = this.onLine + 1;
                }
                if (item.status === "离线") {
                    this.offLine = this.offLine + 1;
                }
                if (item.alarm_status_name === '报警') {
                    this.callLin = this.callLin + 1;
                }
            });
        },
        //多项选择
        bindEquipment() {
            // console.log(123);
        },

        //获取全部列表(管理员)
        // 获取全部列表(用户)
        getMsg() {
            this.page = 1
            this.selectData2 = 0
            this.selectData = 0
            request({
                url: "v1/equipment/list",
                method: "GET",
                data: {
                    page: this.page
                }
            }).then(res => {
                if (res.data.errorcode == 401) {
                    uni.showModal({
                        title: res.data.messages,
                        showCancel: false
                    });
                } else {
                    this.list = res.data.result.list.data;
                    console.log(res, "获取全部列表");
                    this.resOnline(this.list);
                    let tabArr = [
                        `${res.data.result.list.total}\n全部`,
                        `${this.onLine}\n在线`,
                        `${this.offLine}\n离线`,
                        `${this.callLin}\n报警`
                    ];
                    this.tabArr = tabArr;
                    this.pageMax = res.data.result.list.last_page
                }

            });
        },

        bindMultiPickerColumnChange: function (e) {
            if (e.detail.column === 0) {
                this.initSelect(e.detail.value)
                this.multiIndex[0] = e.detail.value
            } else if (e.detail.column === 1) {
                this.multiIndex[1] = e.detail.value
                this.twoId = this.array[this.multiIndex[0]].parent[this.multiIndex[1]].id
            }
            console.log(this.oneId, "oneId")
            console.log(this.twoId, "twoId")
        },
        initSelect(index) {
            console.log(this.array[index]);
            this.oneId = this.array[index].id
            this.multiIndex[1] = 0
            this.$set(this.multiArray, 1, [])
            if (this.array[index].parent.length == 0) {
                console.log("如果右边长度等于0,那么清掉右边ID")
                this.twoId = ""
            } else {
                // console.log('我不是空的');
                const arrTwo = this.array[index].parent.map(item => { // 此方法将校区名称区分到一个新数组中
                    return item.name;
                });
                this.$set(this.multiArray, 1, arrTwo)
                this.twoId = this.array[index].parent[0].id
            }
        },
        bindMultiPickerChange1(e) {
            // console.log(111111,this.multiArray);

            console.log(this.array[e.detail.value])
            this.names = this.array[e.detail.value].name
            this.ids = this.array[e.detail.value].id
            this.index = e.target.value;
            // console.log(this.ids)
            this.selectData = 1
            // this.selectData2 = 1
            // this.twoId = this.array[0].children[0].id
            // console.log(this.oneId)
            // console.log(this.twoId)
            request({
                url: `v1/equipment/list`,
                method: "GET",
                data: {
                    group_id: this.ids
                }
            }).then(res => {
                console.log(res, "获取分组设备");
                this.list = res.data.result.list.data;
                this.resOnline(res.data.result.list.data);
                let tabArr = [
                    `${this.list.length}\n全部`,
                    `${this.onLine}\n在线`,
                    `${this.offLine}\n离线`,
                    `${this.callLin}\n报警`
                ];
                this.tabArr = tabArr;
            })
        },

        bindMultiPickerChange(e) {
            console.log(e.detail)
            this.selectData = 1
            this.selectData2 = 1
            // this.twoId = this.array[0].children[0].id
            console.log(this.oneId)
            console.log(this.twoId)
            request({
                url: `v1/equipment/list?group_id=${this.twoId}`,
                method: "GET"
            }).then(res => {
                console.log(res, "获取分组设备");
                this.list = res.data.result.list.data;
                this.resOnline(res.data.result.list.data);
                let tabArr = [
                    `${this.list.length}\n全部`,
                    `${this.onLine}\n在线`,
                    `${this.offLine}\n离线`,
                    `${this.callLin}\n报警`
                ];
                this.tabArr = tabArr;
            })
        },
        initData() {
            const arrOne = this.array.map(item => { // 此方法将校区名称区分到一个新数组中
                return item.name;
            });
            // const arrTwo = this.array[0].parent.map(item => { // 此方法将校区名称区分到一个新数组中
            //     return item.name;
            // });
            this.multiArray = arrOne
            // this.multiArray[1] = arrTwo
            this.oneId = this.array.id
            // this.twoId = this.array[0].parent[0].id
        },
        //获取在线数量
        getOnLine() {
            request({
                url: "v1/equipment/isOnLine",
                method: "GET"
            }).then(res => {
                console.log(res, "在线数量在线数量在线数量在线数量");
                let onlsds = res.data.result[0].counts;
                let onlsds2 = res.data.result[1].counts;
                // console.log(onlsds)
                // console.log(onlsds2)
            });
        },
        //获取地址接口
        // getSite() {
        //     request({
        //         url: "v1/agreement/list"
        //     }).then(res => {
        //         this.arrar2 = res.data.result.list.data;
        //         // console.log(this.arrar2);
        //     });
        // },
        onClickItem(index) {
            if (this.current !== index) {
                this.current = index;
            }
        },
        toDetails(id) {
            uni.navigateTo({
                url: `../details/details?id=${id}`
            });
            console.log(id);
        },
        // 获取报警信息
        getCall() {
            request({
                url: "v1/alarmRecord/alarmRecordCount",
                methods: "GET"
            }).then(res => {
                if (res.data.errorCode == 401) {
                    this.num1 = " "
                } else {
                    this.num1 = res.data.result.alarm_not_handle
                    console.log(res, "获取报警数据获取报警数据获取报警数据")
                }

            })
        },
        getNotRead() {
            request({
                url: "v1/wechat/notRead"
            }).then(res => {
                console.log(res, "未读未读")
                this.num2 = res.data.result
            })
        },
        alarmRecord(page) {
            this.getCall()
            console.log(page, this.max_page);
            if (page >= this.max_page) {
                return null
            }
            request({
                url: "v1/alarmRecord/list",
                method: "GET",
                data: {
                    page,
                }
            }).then(res => {
                console.log(res, "报警记录列表")
                if (res.data.errorcode == 401) {
                    // this.navList = []
                    uni.removeTabBarBadge({
                        index: 3
                    })
                    return
                } else {
                    // this.navList = res.data.result.list.data;
                    // this.equipment = '选择设备',
                    //     this.equipmentTime = "选择日期",
                    //     this.dataEquipment = "选择温度"
                    // for (let i = 0; i < this.navList.length; i++) {
                    //     this.aa += this.navList[i].value
                    // }
                    if (this.num1 > 99) {
                        // this.num1 = "99+"
                        uni.setTabBarBadge({
                            index: 3,
                            text: "99+"
                        });
                    } else if (this.num1 == 0) {
                        uni.removeTabBarBadge({
                            index: 3
                        })
                    } else {
                        uni.setTabBarBadge({
                            index: 3,
                            text: JSON.stringify(this.num1 + this.num2)
                        });
                    }
                }

            })
        },

    },
    components: {
        uniSegmentedControl,
        uniLoadMore,
        QSpicker,
        pickerCustom2
    }
};
</script>

<style lang="scss">
.tittleTop {
    position: fixed;
    top: 87px;
    // z-index: 99;
    width: 750rpx;
    background: #ffffff;
}

.nav {
    // position: fixed;
    // top: 0rpx;
    // z-index: 99;
    width: 750rpx;
}

.index-header {}

.picker {
    color: #fff;
}

.status_bar {
    position: fixed;
    z-index: 999999999;
    width: 100%;
    top: 0;
    height: var(--status-bar-height);
    // width: 100%;
    background: #0c69a4;
}

.bgTop {
    position: fixed;
    width: 100%;
    z-index: 999999999;
    top: var(--status-bar-height);
    background: #0c69a4;
    height: 115rpx;

    .leftNav {
        // margin-top: 60rpx;
        margin-left: -30rpx;
        width: 250rpx;
        height: 50rpx;
        // border: 1rpx solid pink;
        display: flex;
        justify-content: center;
        font-size: 26rpx;

        .leftNav-text {
            display: flex;
            justify-content: center;
            text-align: center;
            align-content: center;
            line-height: 50rpx;
            color: white;
        }

        img {
            position: relative;
            top: -45rpx;
            left: 135rpx;
            width: 40rpx;
            height: 40rpx;
        }
    }
}

.mtStatusbar {
    margin-top: 170rpx;
    // position: relative;
    // z-index: 1;
}

.index-page {
    .segmented-control-item {
        white-space: pre-wrap;
        line-height: 1.3;
        padding: $spacing-s 0;
    }
}

.list {
    .img-des-item {
        padding: $spacing-center;
        padding-bottom: $spacing-center + 10;
        border-bottom: 1rpx solid #ddd;
    }

    .img-box {
        image {
            border-radius: 10rpx;
        }
    }

    .des-box {
        .tag {
            display: inline-block;
            background: $color-success;
            color: #fff;
            border-radius: 20rpx;
            padding: 2rpx 15rpx;
            margin-left: $spacing-s;
            font-size: $fs-base;

            &.warn {
                background: $color-warning;
            }

            &.off {
                background: $color-grey-ce;
            }

            icon {
                vertical-align: middle;
                margin-right: 8rpx;
            }
        }
    }
}
</style>
